<template>
  <zm-dialog :show.sync="visible" :show-confirm-button="false" padding="0" background="transparent">
    <view class="flex flex-1 items-center justify-center" @click="handleLook">
      <image v-if="!renew" :src="data.config.popUpImageUrl" mode="widthFix" />
      <image v-else :src="data.config.renewalImageUrl" mode="widthFix" />
    </view>
    <view slot="outside" class="flex justify-center mt-24">
      <zm-icon name="close" color="#fff" size="74rpx" @click="handleClose"> </zm-icon>
    </view>
  </zm-dialog>
</template>

<script>
import mixin from "@/decoration/mixins"
import { mapGetters, mapActions } from "vuex"
export default {
  name: "deco-vip-popup",
  mixins: [mixin],
  data() {
    return {
      list: [],
      visible: false,
      renew: false
    }
  },
  computed: {
    ...mapGetters(["userInfo"])
  },
  watch: {
    userInfo(val) {
      if (val.level == "1" && this.data.type == "vipOne" && val.isVipCardRemind == 0) {
        this.visible = true
      }
    },
    deep: true,
    immediate: true
  },

  mounted() {},

  methods: {
    init() {
      if (this.mitt) {
        this.mitt.on("refresh", () => {})
      }
    },
    show({ type }) {
      this.renew = type == 2
      this.visible = true
    },
    // 关闭
    async handleClose() {
      this.visible = false
      if (this.data.type == "vipTwo") {
        this.getUserInfo()
      } else {
        uni.$api.vipCardV2.setRemindStatus({ memberId: this.userInfo.memberId }).then(() => {
          this.getUserInfo()
        })
      }
    },
    handleLook() {
      this.handleClose()
    },
    ...mapActions(["getUserInfo"])
  }
}
</script>

<style lang="scss" scoped>
.a {
  background-color: transparent;
}
</style>
